<!DOCTYPE html>
<html data-bs-theme="dark" class="no-js" lang="en">
<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
	<title>TechPro – IT Solutions & Business Services Multipurpose HTML5 Template</title>
	<link rel="icon" href="assets/img/favicon.png" type="image/gif" sizes="16x16">
	<link rel="icon" href="assets/img/favicon.png" type="image/gif" sizes="18x18">
	<link rel="icon" href="assets/img/favicon.png" type="image/gif" sizes="20x20">

	<link rel="stylesheet" href="static/css/bootstrap.min.css">
	<link rel="stylesheet" href="static/css/bootstrap-icons.css">
	<link rel="stylesheet" href="static/css/font-awesome-pro.css">
	<link rel="stylesheet" href="static/css/animate.css">
	<link rel="stylesheet" href="static/css/glightbox.min.css">
	<link rel="stylesheet" href="static/css/scrollCue.css">
	<link rel="stylesheet" href="static/css/swiper-bundle.css">
	<link rel="stylesheet" href="static/css/spacing.css">
	<link rel="stylesheet" href="static/css/main.css">
	<link rel="stylesheet" href="static/css/responsive.css">

</head>
<body>
	<!-- Preloader -->
	<div class="preloader">
     	<div class="loading-container">
        	<div class="loading"></div>
        	<div id="loading-icon">
        		<img src="static/picture/favicon.png" alt="TechPro">
        	</div>
     	</div>
  	</div>

	<!-- Header -->
	<header class="header sticky-header">
		<div class="container">
			<div class="row">
				<div class="col-lg-2 col-md-4 col-5 align-self-center">
					<div class="logo">
						<a href="index.html">
							<img class="sticky-logo" src="static/picture/logo.png" alt="Logo">
							<img src="static/picture/white-logo.png" alt="white-logo">
						</a>
					</div>
				</div>
				<div class="col-lg-10 col-md-8 col-7">
					<div class="h-right-button">
						<a class="button-1" href="#">Get Consultant</a>
					</div>

					<!-- Menu -->
	                <div class="canvas_open_full">
	                    <div class="canvas_open">
	                        <a href="javascript:void(0)">
	                            <i class="fa-sharp fa-solid fa-bars-staggered"></i>
	                        </a>
	                    </div>
	                </div>
	                <div class="menu">
	                    <nav>
	                        <ul>
								<li class="menu-item-has-children"><a href="#">Home</a>
									<ul class="sub-menu">
										<li><a href="index.html">Home 01</a></li>
										<li><a href="index2.html">Home 02</a></li>
										<li><a href="index3.html">Home 03</a></li>
										<li><a href="index4.html">Home 04</a></li>
										<li><a href="index5.html">Home 05</a></li>
										<li><a href="index1-dark.html">Home 01 Dark</a></li>
										<li><a href="index2-dark.html">Home 02 Dark</a></li>
										<li><a href="index3-dark.html">Home 03 Dark</a></li>
										<li><a href="index4-dark.html">Home 04 Dark</a></li>
										<li><a href="">Home 05 Dark</a></li>
									</ul>
								</li>
								<li><a href="about.html">About Us</a></li>
								<li class="menu-item-has-children"><a href="#">Services</a>
									<ul class="sub-menu">
										<li><a href="services.html">Services</a></li>
										<li><a href="services-details.html">Services Details</a></li>
									</ul>
								</li>
								<li class="menu-item-has-children"><a href="#">Portfolio</a>
									<ul class="sub-menu">
										<li><a href="portfolio.html">Portfolio</a></li>
										<li><a href="portfolio-2-columns.html">Portfolio 2 Columns</a></li>
										<li><a href="portfolio-details.html">Portfolio Details</a></li>
									</ul>
								</li>
								<li class="menu-item-has-children"><a href="#">Page</a>
									<ul class="sub-menu">
										<li><a href="team.html">Team</a></li>
										<li><a href="pricing-plan.html">Pricing & Plans</a></li>
										<li><a href="pricing-plan2.html">Pricing & Plans 2</a></li>
										<li><a href="testimonial.html">Testimonials</a></li>
										<li><a href="faq.html">Faq</a></li>
										<li><a href="404.html">404 Error</a></li>
										<li><a href="terms-conditions.html">Terms & Conditions</a></li>
										<li><a href="privacy-policy.html">Privacy Policy</a></li>
									</ul>
								</li>
								<li class="menu-item-has-children"><a href="#">Blog</a>
									<ul class="sub-menu">
										<li><a href="blog.html">Blog</a></li>
										<li><a href="blog-standard.html">Blog Standard</a></li>
										<li><a href="blog-3-columns.html">Blog Three Columns</a></li>
										<li><a href="blog-left-sidebar.html">Blog Left Sidebar</a></li>
										<li><a href="single.html">Blog Details</a></li>
									</ul>
								</li>
								<li><a href="contact.html">Contact Us</a></li>
							</ul>
	                    </nav>
	                </div>

				</div>
			</div>
		</div>
	</header>
	<div class="mobile-menu-area">
	    <!--offcanvas menu area start-->
	    <div class="off_canvars_overlay">
	                
	    </div>
	    <div class="offcanvas_menu">
	        <div class="offcanvas_menu_wrapper">
	            <div class="canvas_close">
	                <a href="javascript:void(0)"><i class="bi bi-x-lg"></i></a>  
	            </div>
	            <div class="mobile-logo">
	                <a href="index.html">
	                    <img src="static/picture/logo.png" alt="Logo">
	                </a>
	            </div>
	            <div id="menu" class="text-left ">
	                <ul class="offcanvas_main_menu">
	                    <li class="menu-item-has-children"><a href="index.html">Home</a>
							<ul class="sub-menu">
								<li><a href="index.html">Home 01</a></li>
								<li><a href="index2.html">Home 02</a></li>
								<li><a href="index3.html">Home 03</a></li>
								<li><a href="index4.html">Home 04</a></li>
								<li><a href="index5.html">Home 05</a></li>
								<li><a href="index1-dark.html">Home 01 Dark</a></li>
								<li><a href="index2-dark.html">Home 02 Dark</a></li>
								<li><a href="index3-dark.html">Home 03 Dark</a></li>
								<li><a href="index4-dark.html">Home 04 Dark</a></li>
								<li><a href="">Home 05 Dark</a></li>
							</ul>
						</li>
						<li><a href="about.html">About Us</a></li>
						<li class="menu-item-has-children"><a href="services.html">Services</a>
							<ul class="sub-menu">
								<li><a href="services.html">Services</a></li>
								<li><a href="services-details.html">Services Details</a></li>
							</ul>
						</li>
						<li class="menu-item-has-children"><a href="portfolio.html">Portfolio</a>
							<ul class="sub-menu">
								<li><a href="portfolio.html">Portfolio</a></li>
								<li><a href="portfolio-2-columns.html">Portfolio 2 Columns</a></li>
								<li><a href="portfolio-details.html">Portfolio Details</a></li>
							</ul>
						</li>
						<li class="menu-item-has-children"><a href="#">Page</a>
							<ul class="sub-menu">
								<li><a href="team.html">Team</a></li>
								<li><a href="pricing-plan.html">Pricing & Plans</a></li>
								<li><a href="pricing-plan2.html">Pricing & Plans 2</a></li>
								<li><a href="testimonial.html">Testimonials</a></li>
								<li><a href="faq.html">Faq</a></li>
								<li><a href="404.html">404 Error</a></li>
								<li><a href="terms-conditions.html">Terms & Conditions</a></li>
								<li><a href="privacy-policy.html">Privacy Policy</a></li>
							</ul>
						</li>
						<li class="menu-item-has-children"><a href="blog.html">Blog</a>
							<ul class="sub-menu">
								<li><a href="blog.html">Blog</a></li>
								<li><a href="blog-standard.html">Blog Standard</a></li>
								<li><a href="blog-3-columns.html">Blog Three Columns</a></li>
								<li><a href="blog-left-sidebar.html">Blog Left Sidebar</a></li>
								<li><a href="single.html">Blog Details</a></li>
							</ul>
						</li>
						<li><a href="contact.html">Contact Us</a></li>
	                </ul>
	            </div>
	        </div>
	    </div>
	</div>
	<!-- End Header Section -->


	
	<!-- Start Hero Section -->
	<section class="ct-hero-section3 hero-padding-180-200" style="background-image: url('static/image/hero-bg-3.jpg');">
        <div id="particles-js"></div>
        <div class="container">
            <div class="row">
                <div class="col-lg-6 align-self-center">
                    <div class="content">
                        <h4>EMPOWER YOUR BUSINESS</h4>
                        <h2>Excellent IT Services For Your Success</h2>
                        <p>It is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout.</p>
                        <div class="h-button vedio">
                            <a class="button-1" href="#">Our Services</a>
                            <div class="video-btn">
                                <a class="video-p-btn" href="#"><i class="fas fa-play"></i></a>
                            </div>

                        </div>
                    </div>
                </div>
                <div class="col-lg-6 align-self-center">
                    <div class="image" data-tilt="" data-tilt-scale="1.05">
                        <img src="static/picture/about2.png" alt="hero image">
                    </div>
                </div>
            </div>
        </div>
    </section>
	<!-- End Hero Section -->

	<!-- Start Services Section -->
	<section class="pt-hero-services-area">
		<div class="container">
			<div class="row" data-cues="slideInUp">
				<!-- Single -->
				<div class="custom-col col-lg-4 col-md-4 col-12 pb-30">
					<div class="services-card-item-style2">
					   	<div class="icon">
					      	<div>
					         	<i class="fas fa-star-of-david"></i>
					      	</div>
					   	</div>
					   	<div class="content">
					      	<h2><a href="services-details.html">Product Developemnt</a></h2>
					      	<p>Morbi porttitor nibh justo, sit Amet imperdiet ligula laoreet eu. Sed mollis</p>
					   	</div>
					</div>
				</div>
				<!-- Single -->
				<div class="custom-col col-lg-4 col-md-4 col-12 pb-30">
					<div class="services-card-item-style2">
					   	<div class="icon">
					      	<div>
					         	<i class="fa-sharp fa-solid fa-code"></i>
					      	</div>
					   	</div>
					   	<div class="content">
					      	<h2><a href="services-details.html">Web Development</a></h2>
					      	<p>Morbi porttitor nibh justo, sit Amet imperdiet ligula laoreet eu. Sed mollis</p>
					   	</div>
					</div>
				</div>
				<!-- Single -->
				<div class="custom-col col-lg-4 col-md-4 col-12 pb-30">
					<div class="services-card-item-style2">
					   	<div class="icon">
					      	<div>
					         	<i class="fas fa-pencil-ruler"></i>
					      	</div>
					   	</div>
					   	<div class="content">
					      	<h2><a href="services-details.html">UI/UX Designing</a></h2>
					      	<p>Morbi porttitor nibh justo, sit Amet imperdiet ligula laoreet eu. Sed mollis</p>
					   	</div>
					</div>
				</div>
				<!-- Single -->
				<div class="custom-col col-lg-4 col-md-4 col-12 pb-30">
					<div class="services-card-item-style2">
					   	<div class="icon">
					      	<div>
					         	<i class="fa-sharp fa-solid fa-database"></i>
					      	</div>
					   	</div>
					   	<div class="content">
					      	<h2><a href="services-details.html">Data Analysis</a></h2>
					      	<p>Morbi porttitor nibh justo, sit Amet imperdiet ligula laoreet eu. Sed mollis</p>
					   	</div>
					</div>
				</div>
				<!-- Single -->
				<div class="custom-col col-lg-4 col-md-4 col-12 pb-30">
					<div class="services-card-item-style2">
					   	<div class="icon">
					      	<div>
					         	<i class="fas fa-bullhorn"></i>
					      	</div>
					   	</div>
					   	<div class="content">
					      	<h2><a href="services-details.html">Digital Marketing</a></h2>
					      	<p>Morbi porttitor nibh justo, sit Amet imperdiet ligula laoreet eu. Sed mollis</p>
					   	</div>
					</div>
				</div>
				
			</div>
		</div>
	</section>
	<!-- End Services Section -->


	<!-- Start About Us Section -->
	<div class="ct-about-us-section2 section-padding-2">
   		<div class="container">
      		<div class="row">
         		<div class="col-lg-6 mb-30 align-self-center">
            		<div class="ct-about-us-image">
               			<div class="row">
                  			<div class="col-sm-8 col-6">
                     			<img class="wow fadeInUp" data-wow-delay=".5s" src="static/picture/about1.jpg" alt="about image">
                  			</div>
                  			<div class="col-sm-4 col-6 col-pl-0 pb-30 align-self-end position-relative ">
                     			<img class="wow fadeInRight" data-wow-delay=".8s" src="static/picture/about2.jpg" alt="image">
                     			<div class="ab-im-content wow fadeInUp">
                        			<div class="icon">
                           				<i class="fas fa-phone-alt"></i>
                        			</div>
			                        <div class="con">
			                           	<strong>Call Anytime</strong>
			                           	<a href="#">+99 (786) 8765</a>
			                        </div>
                     			</div>
                  			</div>
               			</div>
            		</div>
         		</div>
         		<div class="col-lg-6 mb-30 align-self-center ">
            		<div class="content pl-20-992">
               			<div class="ct-section-title text-left">
                  			<h4 class="wow fadeInUp" data-wow-delay=".2s">ABOUS US</h4>
                  			<h2 class="wow fadeInUp" data-wow-delay=".5s">Preparing For Your Business Provide Best <span>IT Solution</span></h2>
               			</div>
               			<p class="text">Quickly re-engineer intuitive e-services whereas compelling niches. Professionally syndicate strategic e-commerce without covalent leadership skills.</p>
               			<div class="ab-list mb-25">
	                  		<ul>
	                     		<li><i class="fa-regular fa-octagon-check"></i> <span>Website & Mobile application design & Development</span></li>
	                     		<li><i class="fa-regular fa-octagon-check"></i> <span>Data Management Experts</span></li>
	                     		<li><i class="fa-regular fa-octagon-check"></i> <span>IT Infrastructure Solutions</span></li>
	                  		</ul>
	               		</div>
	               		<div class="about-btn" data-cues="slideInUp">
	                  		<a href="#" class="button-1" data-cue="slideInUp">Learn More <i class="fa-regular fa-arrow-right"></i></a>
	               		</div>
	            	</div>
         		</div>
      		</div>
   		</div>
	</div>
	<!-- End About Us Section -->

	<!-- Start Industry We Serve Section -->
	<section class="section-padding-2 section-bg">
		<div class="container">
			<div class="row">
				<div class="col-lg-8 offset-lg-2 mb-30">
					<div class="ct-section-title text-center">
						<h4 class="wow fadeInUp animated" data-wow-delay=".2s">Industry We Serve</h4>
						<h2 class="wow fadeInUp animated" data-wow-delay=".4s">Our industry expertise and <span>Solutions</span></h2>
						<p class="wow fadeInUp animated" data-wow-delay=".6s">At Your Company Name], we specialize in delivering innovative IT solutions tailored for a diverse range of industries. Our expertise extends across</p>
					</div>
				</div>
			</div>
			<div class="row" data-cues="slideInUp">
				<!-- Single -->
				<div class="col-lg-2 col-md-4 col-6 mb-30">
					<div class="ct-industry-item">
					   	<div class="icon">
					      	<div class="ic">
					         	<i class="fa-regular fa-graduation-cap"></i>
					      	</div>
					   	</div>
					   	<div class="content">
					      	<h2>Education</h2>
					   	</div>
					</div>
				</div>
				<!-- Single -->
				<div class="col-lg-2 col-md-4 col-6 mb-30">
					<div class="ct-industry-item">
					   	<div class="icon">
					      	<div class="ic">
					         	<i class="fa-sharp fa-regular fa-cart-shopping"></i>
					      	</div>
					   	</div>
					   	<div class="content">
					      	<h2>E-Commerce</h2>
					   	</div>
					</div>
				</div>
				<!-- Single -->
				<div class="col-lg-2 col-md-4 col-6 mb-30">
					<div class="ct-industry-item">
					   	<div class="icon">
					      	<div class="ic">
					         	<i class="fa-regular fa-heart-pulse"></i>
					      	</div>
					   	</div>
					   	<div class="content">
					      	<h2>Healthcare</h2>
					   	</div>
					</div>
				</div>
				<!-- Single -->
				<div class="col-lg-2 col-md-4 col-6 mb-30">
					<div class="ct-industry-item">
					   	<div class="icon">
					      	<div class="ic">
					         	<i class="fa-sharp fa-regular fa-car"></i>
					      	</div>
					   	</div>
					   	<div class="content">
					      	<h2>Automotive</h2>
					   	</div>
					</div>
				</div>
				<!-- Single -->
				<div class="col-lg-2 col-md-4 col-6 mb-30">
					<div class="ct-industry-item">
					   	<div class="icon">
					      	<div class="ic">
					         	<i class="fa-sharp fa-regular fa-building-columns"></i>
					      	</div>
					   	</div>
					   	<div class="content">
					      	<h2>Finance</h2>
					   	</div>
					</div>
				</div>
				<!-- Single -->
				<div class="col-lg-2 col-md-4 col-6 mb-30">
					<div class="ct-industry-item">
					   	<div class="icon">
					      	<div class="ic">
					         	<i class="fa-sharp fa-regular fa-laptop"></i>
					      	</div>
					   	</div>
					   	<div class="content">
					      	<h2>Software</h2>
					   	</div>
					</div>
				</div>
			</div>
		</div>
	</section>
	<!-- End Industry We Serve Section -->

	<!-- Start Our operating procedure -->
	<section class="ct-tab-image-section-full section-padding v-banner-bottom-p">
		<div class="container">
			<div class="row">
				<div class="col-lg-6 offset-lg-3 col-md-10 offset-md-1 mb-30">
					<div class="ct-section-title text-center">
						<h4 class="wow fadeInUp animated" data-wow-delay=".2s">Our Operating Procedure</h4>
						<h2 class="wow fadeInUp animated" data-wow-delay=".4s">Emerging Business Data <span>Science</span> Solutions.</h2>
					</div>
				</div>
			</div>
			<div class="row">
				<div class="col-lg-6">
                    <div class="ct-tab-image-left mb-30">
                        <div class="nav nav-tabs" id="nav-tabImageSec" data-cues="slideInUp" role="tablist">

                            <div class="nav-link active" id="nav-ctimgta-1-tab" data-bs-toggle="tab" data-bs-target="#nav-ctimgta-1" role="tab" aria-controls="nav-ctimgta-1" aria-selected="true">
                                <div class="nav-item-signle">
                                    <div class="number">
                                        <span>01</span>
                                    </div>
                                    <div class="content">
                                        <h4>Collect the Data</h4>
                                        <p>Nullam felis augue, mattis at est a, tempor dignissim lacus. fermentum maximus mauris.</p>
                                    </div>
                                </div>
                            </div>

                            <div class="nav-link" id="nav-ctimgta-2-tab" data-bs-toggle="tab" data-bs-target="#nav-ctimgta-2" role="tab" aria-controls="nav-ctimgta-2" aria-selected="false">
                                <div class="nav-item-signle">
                                    <div class="number">
                                        <span>02</span>
                                    </div>
                                    <div class="content">
                                        <h4>Frame the Problem</h4>
                                        <p>Nullam felis augue, mattis at est a, tempor dignissim lacus. fermentum maximus mauris.</p>
                                    </div>
                                </div>
                            </div>

                            <div class="nav-link" id="nav-ctimgta-3-tab" data-bs-toggle="tab" data-bs-target="#nav-ctimgta-3" role="tab" aria-controls="nav-ctimgta-3" aria-selected="false">
                                <div class="nav-item-signle">
                                    <div class="number">
                                        <span>03</span>
                                    </div>
                                    <div class="content">
                                        <h4>Process the Data</h4>
                                        <p>Nullam felis augue, mattis at est a, tempor dignissim lacus. fermentum maximus mauris.</p>
                                    </div>
                                </div>
                            </div>

                        </div>
                    </div>
                </div>

                <div class="col-lg-6">
                    <div class="ct-tab-image-image mb-30">
                        <div class="tab-content" id="nav-tabImageSecContent">

                            <div class="tab-pane fade show active" id="nav-ctimgta-1" role="tabpanel" aria-labelledby="nav-ctimgta-1-tab" tabindex="0">
                                <div class="ct-t-img">
                                    <img src="static/picture/our-procedure.png" alt="Image">
                                </div>
                            </div>

                            <div class="tab-pane fade" id="nav-ctimgta-2" role="tabpanel" aria-labelledby="nav-ctimgta-2-tab" tabindex="0">
                                <div class="ct-t-img">
                                    <img src="static/picture/our-procedure.png" alt="Image">
                                </div>
                            </div>

                            <div class="tab-pane fade" id="nav-ctimgta-3" role="tabpanel" aria-labelledby="nav-ctimgta-3-tab" tabindex="0">
                                <div class="ct-t-img">
                                    <img src="static/picture/our-procedure.png" alt="Image">
                                </div>
                            </div>

                        </div>
                    </div>
                </div>
			</div>
		</div>
	</section>
	<!-- End Our operating procedure -->

	<!-- Banner Video Section -->
	<div class="ct-video-banner-image section-bg">
        <div class="container">
            <div class="row">
                <div class="col-lg-12">
                    <div class="banner-img" style="background-image: url('static/image/video-im.jpg');">
                        <div class="video-btn">
                            <a class="video-p-btn" href="#"><i class="fas fa-play"></i></a>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
	<!-- Banner Video Section -->

	<!-- Start Work In Progress -->
	<div class="ct-workin-progress section-padding-2 section-bg">
        <div class="container">
            
            <div class="row">
				<div class="col-lg-6 offset-lg-3 col-md-10 offset-md-1 mb-50">
					<div class="ct-section-title text-center">
						<h4 class="wow fadeInUp animated" data-wow-delay=".2s">WORK PROCESS</h4>
						<h2 class="wow fadeInUp animated" data-wow-delay=".4s">How to work <span>it!</span></h2>
					</div>
				</div>
			</div>
            <div class="row position-relative" data-cues="slideInUp">
            	<div class="process-line">
	                <img src="static/picture/process_line-1.svg" alt="techpro">
	            </div>
                <div class="col-lg-3 col-md-6 col-12 pb-30">
                    <div class="work-in-progress-card">
                        <div class="card-num">
                            <span>01</span>
                        </div>
                        <div class="icon">
                           	<div class="im">
                                <img src="static/picture/process_card_1.svg" alt="title">
                            </div>
                        </div>
                        <div class="content">
                            <h3>Select a project</h3>
                            <p>Continua scale empowered metrics with cost effective innovation.</p>
                        </div>
                    </div>
                </div>
                <div class="col-lg-3 col-md-6 col-12 pb-30">
                    <div class="work-in-progress-card">
                        <div class="card-num">
                            <span>02</span>
                        </div>
                        <div class="icon">
                           	<div class="im">
                                <img src="static/picture/process_card_2.svg" alt="title">
                            </div>
                        </div>
                        <div class="content">
                            <h3>Project Analysis</h3>
                            <p>Continua scale empowered metrics with cost effective innovation.</p>
                        </div>
                    </div>
                </div>
                <div class="col-lg-3 col-md-6 col-12 pb-30">
                    <div class="work-in-progress-card">
                        <div class="card-num">
                            <span>03</span>
                        </div>
                        <div class="icon">
                           	<div class="im">
                                <img src="static/picture/process_card_3.svg" alt="title">
                            </div>
                        </div>
                        <div class="content">
                            <h3>Plan Execute</h3>
                            <p>Continua scale empowered metrics with cost effective innovation.</p>
                        </div>
                    </div>
                </div>
                <div class="col-lg-3 col-md-6 col-12 pb-30">
                    <div class="work-in-progress-card">
                        <div class="card-num">
                            <span>04</span>
                        </div>
                        <div class="icon">
                           	<div class="im">
                                <img src="static/picture/process_card_4.svg" alt="title">
                            </div>
                        </div>
                        <div class="content">
                            <h3>Deliver Result</h3>
                            <p>Continua scale empowered metrics with cost effective innovation.</p>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- End Work In Progress -->

	

	<!-- Start Portfolio Section  -->
	<div class="sec-pt-100">
        <div class="container">
            <div class="row">
                <div class="col-lg-8 offset-lg-2 text-center mb-40">
                    <div class="ct-section-title">
                        <h4 class="wow fadeInUp" data-wow-delay=".2s">SELECTED PROJECTS</h4>
                        <h2 class="wow fadeInUp" data-wow-delay=".4s">Digital Case <span>Studies.</span></h2>
                    </div>
                </div>
            </div>
        </div>
        <div class="portfolio-slider-section">
            <div class="portfolio-slider-full swiper-container">
                <div class="swiper-wrapper">
                	<!-- Single -->
                    <div class="swiper-slide wow slideInDown" data-wow-delay=".3s">
                        <div class="portfolio-item-single">
	                        <div class="thumbnail">
	                            <img src="static/picture/p-1.png" alt="portfolio">
	                        </div>
	                        <div class="zoom-icon">
	                            <a class="image-popup" data-gallery="portfolio1" href="static/picture/p-1.png"><i class="fa-solid fa-plus"></i></a>
	                        </div>
	                        <div class="content">
	                            <h2><a href="portfolio-details.html">Effective Solutions</a></h2>
	                            <strong>Data Analaysis</strong>
	                        </div>
	                    </div>
                    </div>
                	<!-- Single -->
                    <div class="swiper-slide wow slideInDown" data-wow-delay=".5s">
                        <div class="portfolio-item-single">
	                        <div class="thumbnail">
	                            <img src="static/picture/p-2.png" alt="portfolio">
	                        </div>
	                        <div class="zoom-icon">
	                            <a class="image-popup" data-gallery="portfolio1" href="static/picture/p-2.png"><i class="fa-solid fa-plus"></i></a>
	                        </div>
	                        <div class="content">
	                            <h2><a href="portfolio-details.html">Effective Solutions</a></h2>
	                            <strong>Data Analaysis</strong>
	                        </div>
	                    </div>
                    </div>
                	<!-- Single -->
                    <div class="swiper-slide wow slideInDown" data-wow-delay=".7s">
                        <div class="portfolio-item-single">
	                        <div class="thumbnail">
	                            <img src="static/image/p-3.png" alt="portfolio">
	                        </div>
	                        <div class="zoom-icon">
	                            <a class="image-popup" data-gallery="portfolio1" href="static/file/p-3.png"><i class="fa-solid fa-plus"></i></a>
	                        </div>
	                        <div class="content">
	                            <h2><a href="portfolio-details.html">Effective Solutions</a></h2>
	                            <strong>Data Analaysis</strong>
	                        </div>
	                    </div>
                    </div>
                	<!-- Single -->
                    <div class="swiper-slide wow slideInDown" data-wow-delay=".7s">
                        <div class="portfolio-item-single">
	                        <div class="thumbnail">
	                            <img src="static/picture/p-4.png" alt="portfolio">
	                        </div>
	                        <div class="zoom-icon">
	                            <a class="image-popup" data-gallery="portfolio1" href="static/picture/p-4.png"><i class="fa-solid fa-plus"></i></a>
	                        </div>
	                        <div class="content">
	                            <h2><a href="portfolio-details.html">Effective Solutions</a></h2>
	                            <strong>Data Analaysis</strong>
	                        </div>
	                    </div>
                    </div>
                	<!-- Single -->
                    <div class="swiper-slide wow slideInDown" data-wow-delay=".3s">
                        <div class="portfolio-item-single">
	                        <div class="thumbnail">
	                            <img src="static/picture/p-5.png" alt="portfolio">
	                        </div>
	                        <div class="zoom-icon">
	                            <a class="image-popup" data-gallery="portfolio1" href="static/picture/p-5.png"><i class="fa-solid fa-plus"></i></a>
	                        </div>
	                        <div class="content">
	                            <h2><a href="portfolio-details.html">Effective Solutions</a></h2>
	                            <strong>Data Analaysis</strong>
	                        </div>
	                    </div>
                    </div>
                </div>
                <div class="portfolio-slider-dot d-sm-none"></div>
                <div class="portfolio-nav d-none d-sm-block">
                    <div class="portfolio-button-prev">
                        <i class="fa-regular fa-arrow-left"></i>
                    </div>
                    <div class="portfolio-button-next">
                        <i class="fa-regular fa-arrow-right"></i>
                    </div>
                </div>
            </div>
        </div>
    </div>
	<!-- End Portfolio Section  -->

	<!-- Start Pricing Plan Section -->
	<section class="ct-pricing-plan-section section-padding-2">
		<div class="container">
			<div class="row">
				<div class="col-lg-6 offset-lg-3 col-md-10 offset-md-1">
                    <div class="ct-section-title text-center">
                        <h4 class="wow fadeInUp" data-wow-delay=".2s">Pricing Plan</h4>
                        <h2 class="wow fadeInUp" data-wow-delay=".4s">Choose the Best Plan that <span> You Want</span></h2>
                    </div>
                </div>
			</div>
			<div class="row text-center mb-30">
				<div class="col-lg-12">
					<p class="save-txt wow fadeInUp" data-wow-delay=".4s">
	                    Save up to 10%
	                </p>
					<ul class="nav nav-tabs" id="myTabPrice" role="tablist">
                        <li class="nav-item" role="presentation">
                            <button class="nav-link active" id="price1-tab" data-bs-toggle="tab" data-bs-target="#price1-tab-pane" role="tab" aria-controls="price1-tab-pane" aria-selected="true">Monthly</button>
                        </li>
                        <li class="nav-item" role="presentation">
                            <button class="nav-link" id="price2-tab" data-bs-toggle="tab" data-bs-target="#price2-tab-pane" role="tab" aria-controls="price2-tab-pane" aria-selected="false">Yearly</button>
                        </li>
                    </ul>
				</div>
			</div>
			<div class="row">
				<div class="col-lg-12">
                    <div class="tab-content" id="myTabPriceContent">
                        <div class="tab-pane fade show active" id="price1-tab-pane" role="tabpanel" aria-labelledby="price1-tab" tabindex="0">
                            <div class="row" data-cues="slideInUp">
                            	<!-- Single -->
                                <div class="col-lg-4 col-md-6 pb-30">
                                    <div class="ct-price-card">
                                        <h4>Basic</h4>
                                        <div class="price">
                                            <h2>
                                                <span>$</span><span class="p">00.0</span><sub>Monthly</sub>
                                            </h2>
                                        </div>
                                        <div class="s-content">
                                            <p>Best for personal uses</p>
                                        </div>
                                        <div class="p-con">
                                            <ul>
                                                <li>
                                                    <i class="fa-sharp fa-regular fa-check"></i>
                                                    <span>Full Access Free</span>
                                                </li>
                                                <li>
                                                    <i class="fa-sharp fa-regular fa-check"></i>
                                                    <span>Business & Financ Analysing</span>
                                                </li>
                                                <li>
                                                    <i class="fa-sharp fa-regular fa-check"></i>
                                                    <span>Exclusive Templates</span>
                                                </li>
                                                <li>
                                                    <i class="fa-sharp fa-regular fa-check"></i>
                                                    <span>Access 12+ use-cases</span>
                                                </li>
                                                <li class="no">
                                                    <i class="fa-sharp fa-regular fa-xmark"></i>
                                                    <span>Unlimited Features</span>
                                                </li>
                                                <li class="no">
                                                    <i class="fa-sharp fa-regular fa-xmark"></i>
                                                    <span>24 hour Support</span>
                                                </li>
                                            </ul>
                                        </div>
                                            <div class="p-button">
                                                <a class="button-2" href="#">Get Started <i class="fa-sharp fa-regular fa-arrow-right"></i></a>
                                            </div>
                                    </div>
                                </div>
                            	<!-- Single -->
                                <div class="col-lg-4 col-md-6 pb-30">
                                    <div class="ct-price-card active">
                                        <h4>Standard</h4>
                                        <div class="price">
                                            <h2>
                                                <span>$</span><span class="p">9</span><sub>Monthly</sub>
                                            </h2>
                                        </div>
                                        <div class="badge-text">
                                            <p>Popular</p>
                                        </div>
                                        <div class="s-content">
                                            <p>Best for personal uses</p>
                                        </div>
                                        <div class="p-con">
                                            <ul>
                                                <li>
                                                    <i class="fa-sharp fa-regular fa-check"></i>
                                                    <span>Full Access Free</span>
                                                </li>
                                                <li>
                                                    <i class="fa-sharp fa-regular fa-check"></i>
                                                    <span>Business & Financ Analysing</span>
                                                </li>
                                                <li>
                                                    <i class="fa-sharp fa-regular fa-check"></i>
                                                    <span>Exclusive Templates</span>
                                                </li>
                                                <li>
                                                    <i class="fa-sharp fa-regular fa-check"></i>
                                                    <span>Access 22+ use-cases</span>
                                                </li>
                                                <li>
                                                    <i class="fa-sharp fa-regular fa-check"></i>
                                                    <span>Unlimited Features</span>
                                                </li>
                                                <li>
                                                    <i class="fa-sharp fa-regular fa-check"></i>
                                                    <span>24 hour Support</span>
                                                </li>
                                            </ul>
                                        </div>
                                        <div class="p-button">
                                            <a class="button-2" href="#">Get Started <i class="fa-sharp fa-regular fa-arrow-right"></i></a>
                                        </div>
                                    </div>
                                </div>
                            	<!-- Single -->
                                <div class="col-lg-4 col-md-6 pb-30">
                                    <div class="ct-price-card">
                                        <h4>Premium</h4>
                                        <div class="price">
                                            <h2>
                                                <span>$</span><span class="p">29</span><sub>Monthly</sub>
                                            </h2>
                                        </div>
                                        <div class="s-content">
                                            <p>Best for personal uses</p>
                                        </div>
                                        <div class="p-con">
                                            <ul>
                                                <li>
                                                    <i class="fa-sharp fa-regular fa-check"></i>
                                                    <span>Full Access Free</span>
                                                </li>
                                                <li>
                                                    <i class="fa-sharp fa-regular fa-check"></i>
                                                    <span>Business & Financ Analysing</span>
                                                </li>
                                                <li>
                                                    <i class="fa-sharp fa-regular fa-check"></i>
                                                    <span>Exclusive Templates</span>
                                                </li>
                                                <li>
                                                    <i class="fa-sharp fa-regular fa-check"></i>
                                                    <span>Access 100+ use-cases</span>
                                                </li>
                                                <li>
                                                    <i class="fa-sharp fa-regular fa-check"></i>
                                                    <span>Unlimited Features</span>
                                                </li>
                                                <li>
                                                    <i class="fa-sharp fa-regular fa-check"></i>
                                                    <span>24 hour Support</span>
                                                </li>
                                            </ul>
                                        </div>
                                        <div class="p-button">
                                            <a class="button-2" href="#">Get Started <i class="fa-sharp fa-regular fa-arrow-right"></i></a>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>

                        <div class="tab-pane fade" id="price2-tab-pane" role="tabpanel" aria-labelledby="price2-tab" tabindex="0">
                            <div class="row" data-cues="slideInUp">
                            	<!-- Single -->
                                <div class="col-lg-4 col-md-6 pb-30">
                                    <div class="ct-price-card">
                                        <h4>Basic</h4>
                                        <div class="price">
                                            <h2>
                                                <span>$</span><span class="p">10</span><sub>Monthly</sub>
                                            </h2>
                                        </div>
                                        <div class="s-content">
                                            <p>Best for personal uses</p>
                                        </div>
                                        <div class="p-con">
                                            <ul>
                                                <li>
                                                    <i class="fa-sharp fa-regular fa-check"></i>
                                                    <span>Full Access Free</span>
                                                </li>
                                                <li>
                                                    <i class="fa-sharp fa-regular fa-check"></i>
                                                    <span>Business & Financ Analysing</span>
                                                </li>
                                                <li>
                                                    <i class="fa-sharp fa-regular fa-check"></i>
                                                    <span>Exclusive Templates</span>
                                                </li>
                                                <li>
                                                    <i class="fa-sharp fa-regular fa-check"></i>
                                                    <span>Access 100+ use-cases</span>
                                                </li>
                                                <li>
                                                    <i class="fa-sharp fa-regular fa-check"></i>
                                                    <span>Unlimited Features</span>
                                                </li>
                                                <li>
                                                    <i class="fa-sharp fa-regular fa-check"></i>
                                                    <span>24 hour Support</span>
                                                </li>
                                            </ul>
                                        </div>
                                            <div class="p-button">
                                                <a class="button-2" href="#">Get Started <i class="fa-sharp fa-regular fa-arrow-right"></i></a>
                                            </div>
                                    </div>
                                </div>
                            	<!-- Single -->
                                <div class="col-lg-4 col-md-6 pb-30">
                                    <div class="ct-price-card active">
                                        <h4>Standard</h4>
                                        <div class="price">
                                            <h2>
                                                <span>$</span><span class="p">99</span><sub>Monthly</sub>
                                            </h2>
                                        </div>
                                        <div class="badge-text">
                                            <p>Popular</p>
                                        </div>
                                        <div class="s-content">
                                            <p>Best for personal uses</p>
                                        </div>
                                        <div class="p-con">
                                            <ul>
                                                <li>
                                                    <i class="fa-sharp fa-regular fa-check"></i>
                                                    <span>Full Access Free</span>
                                                </li>
                                                <li>
                                                    <i class="fa-sharp fa-regular fa-check"></i>
                                                    <span>Business & Financ Analysing</span>
                                                </li>
                                                <li>
                                                    <i class="fa-sharp fa-regular fa-check"></i>
                                                    <span>Exclusive Templates</span>
                                                </li>
                                                <li>
                                                    <i class="fa-sharp fa-regular fa-check"></i>
                                                    <span>Access 220+ use-cases</span>
                                                </li>
                                                <li>
                                                    <i class="fa-sharp fa-regular fa-check"></i>
                                                    <span>Unlimited Features</span>
                                                </li>
                                                <li>
                                                    <i class="fa-sharp fa-regular fa-check"></i>
                                                    <span>24 hour Support</span>
                                                </li>
                                            </ul>
                                        </div>
                                        <div class="p-button">
                                            <a class="button-2" href="#">Get Started <i class="fa-sharp fa-regular fa-arrow-right"></i></a>
                                        </div>
                                    </div>
                                </div>
                            	<!-- Single -->
                                <div class="col-lg-4 col-md-6 pb-30">
                                    <div class="ct-price-card">
                                        <h4>Premium</h4>
                                        <div class="price">
                                            <h2>
                                                <span>$</span><span class="p">299</span><sub>Monthly</sub>
                                            </h2>
                                        </div>
                                        <div class="s-content">
                                            <p>Best for personal uses</p>
                                        </div>
                                        <div class="p-con">
                                            <ul>
                                                <li>
                                                    <i class="fa-sharp fa-regular fa-check"></i>
                                                    <span>Full Access Free</span>
                                                </li>
                                                <li>
                                                    <i class="fa-sharp fa-regular fa-check"></i>
                                                    <span>Business & Financ Analysing</span>
                                                </li>
                                                <li>
                                                    <i class="fa-sharp fa-regular fa-check"></i>
                                                    <span>Exclusive Templates</span>
                                                </li>
                                                <li>
                                                    <i class="fa-sharp fa-regular fa-check"></i>
                                                    <span>Access 2000+ use-cases</span>
                                                </li>
                                                <li>
                                                    <i class="fa-sharp fa-regular fa-check"></i>
                                                    <span>Unlimited Features</span>
                                                </li>
                                                <li>
                                                    <i class="fa-sharp fa-regular fa-check"></i>
                                                    <span>24 hour Support</span>
                                                </li>
                                            </ul>
                                        </div>
                                        <div class="p-button">
                                            <a class="button-2" href="#">Get Started <i class="fa-sharp fa-regular fa-arrow-right"></i></a>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
			</div>
		</div>
	</section>
	<!-- End Pricing Plan Section -->

	<!-- Start Banner Section -->
	<section class="banner-section-1" style="background-image: url('static/image/banner.jpg')">
        <div class="container">
           <div class="row">
              <div class="col-lg-8 offset-lg-2">
                 <div class="content text-center">
                    <div class="ct-section-title text-center">
                        <h4 class="wow fadeInUp" data-wow-delay=".2s">We are IT service Agency</h4>
                        <h2 class="wow fadeInUp" data-wow-delay=".4s">We Provide Exclusive Digital Service</h2>
                    </div>
                    <a class="button-1 wow fadeInUp" data-wow-delay=".4s" href="#">Explore Now <i class="fa-regular fa-arrow-right-long"></i></a>
                 </div>
              </div>
           </div>
        </div>
    </section>
	<!-- End Banner Section -->

	<!-- Start Client Logo Slider -->
	<div class="ct-client-logo-sec pt-70 pb-70">
        <div class="container">
            <div class="row">
                <div class="col-lg-12 text-center">
                    <div class="ct-l-text mb-45">
                        <p>Join the <span>10.000+</span> companies trusting Techpro</p>
                    </div>
                </div>
            </div>
            <div class="row">
                <div class="col-lg-12">
                    <div class="ct-client-logo-slider swiper-container">
                        <div class="swiper-wrapper">
                        	<!-- Single -->
                            <div class="swiper-slide wow slideInUp" data-wow-delay="0.3s">
                                <div class="single-logo">
                                    <a href="#">
                                        <img src="static/picture/google.svg" alt="logo">
                                    </a>
                                </div>
                            </div>
                        	<!-- Single -->
                            <div class="swiper-slide wow slideInUp" data-wow-delay="0.4s">
                                <div class="single-logo">
                                    <a href="#">
                                        <img src="static/picture/linkeding.svg" alt="logo">
                                    </a>
                                </div>
                            </div>
                        	<!-- Single -->
                            <div class="swiper-slide wow slideInUp" data-wow-delay="0.5s">
                                <div class="single-logo">
                                    <a href="#">
                                        <img src="static/picture/microsoft.svg" alt="logo">
                                    </a>
                                </div>
                            </div>
                        	<!-- Single -->
                            <div class="swiper-slide wow slideInUp" data-wow-delay="0.6s">
                                <div class="single-logo">
                                    <a href="#">
                                        <img src="static/picture/paypal.svg" alt="logo">
                                    </a>
                                </div>
                            </div>
                        	<!-- Single -->
                            <div class="swiper-slide wow slideInUp" data-wow-delay="0.7s">
                                <div class="single-logo">
                                    <a href="#">
                                        <img src="static/picture/printest.svg" alt="logo">
                                    </a>
                                </div>
                            </div>
                        	<!-- Single -->
                            <div class="swiper-slide wow slideInUp" data-wow-delay="0.8s">
                                <div class="single-logo">
                                    <a href="#">
                                        <img src="static/picture/uber.svg" alt="logo">
                                    </a>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>

        </div>
    </div>
	<!-- End Client Logo Slider -->

	<!-- Start Testimonial Area -->
	<section class="section-padding section-bg">
		<div class="container">
			<div class="row">
				<div class="col-lg-6 offset-lg-3 col-md-10 offset-md-1 mb-30">
					<div class="ct-section-title text-center">
						<h4 class="wow fadeInUp animated" data-wow-delay=".2s">Success Stories</h4>
						<h2 class="wow fadeInUp animated" data-wow-delay=".4s">What Our Clients Say</h2>
					</div>
				</div>
			</div>
			
		</div>

		<div class="testimonial-auto-slider-sec">
            <div class="top-slider-tes swiper-container">
                <div class="swiper-wrapper">
                	<!-- Single -->
                    <div class="swiper-slide">
                        <div class="testimonial-card">
                            <div class="rating-a">
                                <div class="quote">
                                   <i class="fa-sharp fa-light fa-ditto"></i>
                                </div>
                                <div class="rating">
                                    <i class="fa-sharp fa-solid fa-star"></i>
                                    <i class="fa-sharp fa-solid fa-star"></i>
                                    <i class="fa-sharp fa-solid fa-star"></i>
                                    <i class="fa-sharp fa-solid fa-star"></i>
                                    <i class="fa-sharp fa-solid fa-star"></i>
                                    <!-- <i class="fa-regular fa-star"></i> -->
                                </div>
                            </div>
                            <div class="content">
                                <p>It is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout.</p>
                            </div>
                            <div class="t-btm">
                                <div class="thum">
                                   <img src="static/picture/01.jpg" alt="icon">
                                </div>
                                <div class="r-name">
                                   	<h4>Adrian Parody</h4>
                                    <span>Creative Designer</span> 
                                </div>
                            </div>
                        </div>
                    </div>
                	<!-- Single -->
                    <div class="swiper-slide">
                        <div class="testimonial-card">
                            <div class="rating-a">
                                <div class="quote">
                                   <i class="fa-sharp fa-light fa-ditto"></i>
                                </div>
                                <div class="rating">
                                    <i class="fa-sharp fa-solid fa-star"></i>
                                    <i class="fa-sharp fa-solid fa-star"></i>
                                    <i class="fa-sharp fa-solid fa-star"></i>
                                    <i class="fa-sharp fa-solid fa-star"></i>
                                    <i class="fa-sharp fa-solid fa-star"></i>
                                    <!-- <i class="fa-regular fa-star"></i> -->
                                </div>
                            </div>
                            <div class="content">
                                <p>It is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout.</p>
                            </div>
                            <div class="t-btm">
                                <div class="thum">
                                   <img src="static/picture/02.jpg" alt="icon">
                                </div>
                                <div class="r-name">
                                   	<h4>Joan Wallace</h4>
                                    <span>Architecture</span> 
                                </div>
                            </div>
                        </div>
                    </div>
                	<!-- Single -->
                    <div class="swiper-slide">
                        <div class="testimonial-card">
                            <div class="rating-a">
                                <div class="quote">
                                   <i class="fa-sharp fa-light fa-ditto"></i>
                                </div>
                                <div class="rating">
                                    <i class="fa-sharp fa-solid fa-star"></i>
                                    <i class="fa-sharp fa-solid fa-star"></i>
                                    <i class="fa-sharp fa-solid fa-star"></i>
                                    <i class="fa-sharp fa-solid fa-star"></i>
                                    <i class="fa-sharp fa-solid fa-star"></i>
                                    <!-- <i class="fa-regular fa-star"></i> -->
                                </div>
                            </div>
                            <div class="content">
                                <p>It is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout.</p>
                            </div>
                            <div class="t-btm">
                                <div class="thum">
                                   <img src="static/picture/authour-1.jpeg" alt="icon">
                                </div>
                                <div class="r-name">
                                   	<h4>Louis Ferguson</h4>
                                    <span>CEO OF KARON</span> 
                                </div>
                            </div>
                        </div>
                    </div>
                    <!-- Single -->
                    <div class="swiper-slide">
                        <div class="testimonial-card">
                            <div class="rating-a">
                                <div class="quote">
                                   <i class="fa-sharp fa-light fa-ditto"></i>
                                </div>
                                <div class="rating">
                                    <i class="fa-sharp fa-solid fa-star"></i>
                                    <i class="fa-sharp fa-solid fa-star"></i>
                                    <i class="fa-sharp fa-solid fa-star"></i>
                                    <i class="fa-sharp fa-solid fa-star"></i>
                                    <i class="fa-sharp fa-solid fa-star"></i>
                                    <!-- <i class="fa-regular fa-star"></i> -->
                                </div>
                            </div>
                            <div class="content">
                                <p>It is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout.</p>
                            </div>
                            <div class="t-btm">
                                <div class="thum">
                                   <img src="static/picture/01.jpg" alt="icon">
                                </div>
                                <div class="r-name">
                                   	<h4>Adrian Parody</h4>
                                    <span>Creative Designer</span> 
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            
        </div>
	</section>
	<!-- End Testimonial Area -->
	
	<!-- Start Blog Section -->
	<section class="section-padding-2">
		<div class="container">
			<div class="row">
				<div class="col-lg-6 offset-lg-3 col-md-10 offset-md-1 mb-30">
					<div class="ct-section-title text-center">
						<h4 class="wow fadeInUp animated" data-wow-delay=".2s">Latest Blog</h4>
						<h2 class="wow fadeInUp animated" data-wow-delay=".4s">Latest News & Updates</h2>
					</div>
				</div>
			</div>
			<div class="row" data-cues="slideInUp">
				<!-- Single -->
				<div class="col-lg-4 col-md-6 mb-30">
					<div class="blog-single-item">
                        <div class="thumbnail">
                            <a href="single.html">
                                <img src="static/picture/blog1.jpg" alt="blog">
                            </a>
                        </div>
                        <div class="content">
                            <div class="date">
                                <i class="fa-light fa-calendar-days"></i> <span>14 Aug 2024</span>
                            </div>
                            <div class="title">
                                <h3><a href="single.html">How To Build The Ultimate Tech Stack For Growth</a></h3>
                            </div>
                            <div class="user-s">
                                <ul>
                                    <li><i class="fa-light fa-user"></i> <span>Admin</span></li>
                                    <li><i class="fa-light fa-comment"></i> <span>02 Comments</span></li>
                                </ul>
                            </div>
                        </div>
                    </div>
				</div>
				<!-- Single -->
				<div class="col-lg-4 col-md-6 mb-30">
					<div class="blog-single-item">
                        <div class="thumbnail">
                            <a href="single.html">
                                <img src="static/picture/blog3.jpg" alt="blog">
                            </a>
                        </div>
                        <div class="content">
                            <div class="date">
                                <i class="fa-light fa-calendar-days"></i> <span>14 Aug 2024</span>
                            </div>
                            <div class="title">
                                <h3><a href="single.html">How To Build And Automate A Referral Program</a></h3>
                            </div>
                            <div class="user-s">
                                <ul>
                                    <li><i class="fa-light fa-user"></i> <span>Admin</span></li>
                                    <li><i class="fa-light fa-comment"></i> <span>02 Comments</span></li>
                                </ul>
                            </div>
                        </div>
                    </div>
				</div>
				<!-- Single -->
				<div class="col-lg-4 col-md-6 mb-30">
					<div class="blog-single-item">
                        <div class="thumbnail">
                            <a href="single.html">
                                <img src="static/picture/blog6.jpg" alt="blog">
                            </a>
                        </div>
                        <div class="content">
                            <div class="date">
                                <i class="fa-light fa-calendar-days"></i> <span>14 Aug 2024</span>
                            </div>
                            <div class="title">
                                <h3><a href="single.html">Data Analysis and the Big Impact on Industry</a></h3>
                            </div>
                            <div class="user-s">
                                <ul>
                                    <li><i class="fa-light fa-user"></i> <span>Admin</span></li>
                                    <li><i class="fa-light fa-comment"></i> <span>02 Comments</span></li>
                                </ul>
                            </div>
                        </div>
                    </div>
				</div>
			</div>
		</div>
	</section>
	<!-- End Blog Section -->

	<!-- Footer Start -->
	<footer class="site-footer">
		<div class="footer-bg-dot" style="background-image: url('static/image/dot-a-white.png')"></div>
		<div class="footer-top">
			<div class="container">
				<div class="row">
					<!-- Singel Item -->
					<div class="col-lg-3 col-sm-6 mb-30">
						<div class="footer-widgets-item">
							<div class="f-logo">
								<a href="index.html">
									<img src="static/picture/white-logo.png" alt="Logo">
								</a>
							</div>
							<p class="content">Lorem ipsum dolor sit amet consectetur adipisicing elit. Esse sit commodi adipisci, asperiores illum excepturi quidem fuga aliquam fugit laudantium!</p>
							<div class="footer-social">
								<div class="footer-social">
									<span><a href="#"><i class="fa-brands fa-facebook-f"></i></a></span>
									<span><a href="#"><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 512 512"><path d="M389.2 48h70.6L305.6 224.2 487 464H345L233.7 318.6 106.5 464H35.8L200.7 275.5 26.8 48H172.4L272.9 180.9 389.2 48zM364.4 421.8h39.1L151.1 88h-42L364.4 421.8z"></path></svg></a></span>
									<span><a href="#"><i class="fa-brands fa-linkedin-in"></i></a></span>					
								</div>
							
							</div>
						</div>
					</div>
					<!-- Singel Item -->
					<div class="col-lg-3 col-sm-6 col-6 mb-30">
						<div class="footer-widgets-item">
							<h2>Company</h2>
							<ul class="menu">
								<li><a href="#">Company Profile</a></li>
								<li><a href="#">Help Center</a></li>
								<li><a href="#">Services</a></li>
								<li><a href="#">Team Members</a></li>
								<li><a href="#">Contact Us</a></li>
							</ul>
						</div>
					</div>
					<!-- Singel Item -->
					<div class="col-lg-3 col-sm-6 col-6 mb-30">
						<div class="footer-widgets-item">
							<h2>Community</h2>
							<ul class="menu">
								<li><a href="#">Career</a></li>
								<li><a href="#">Leadership</a></li>
								<li><a href="#">Press & Media</a></li>
								<li><a href="#">Projects</a></li>
								<li><a href="#">Marketing Services</a></li>
								<li><a href="#">Challenge Of Project</a></li>
							</ul>
						</div>
					</div>
					<!-- Singel Item -->
					<div class="col-lg-3 col-sm-6 mb-30">
						<div class="footer-widgets-item">
							<h2>Contact Info</h2>
							<ul class="contact-info">
								<li>
									<div class="icon">
										<i class="fa-sharp fa-regular fa-house"></i>
									</div>
									<div class="content">
										<h4>Address:</h4>
										<p>5919 Trussville Crossings Pkwy, Birmingham</p>
									</div>
								</li>
								<li>
									<div class="icon">
										<i class="fa-sharp fa-regular fa-envelope"></i>
									</div>
									<div class="content">
										<h4>Email:</h4>
										<p>support@gmail.com</p>
									</div>
								</li>
								<li>
									<div class="icon">
										<i class="fa-regular fa-phone-flip"></i>
									</div>
									<div class="content">
										<h4>Phone:</h4>
										<p>+456 123 4455</p>
									</div>
								</li>
							</ul>
						</div>
					</div>
				</div>
			</div>
		</div>
		<!-- Footer Bottom -->
		<div class="footer-bottom pt-30 pb-30">
			<div class="container">
				<div class="row">
					<div class="col-lg-12">
						<div class="copy-text">
							<p>Copyright &copy; 2024.Company name All rights reserved.<a target="_blank" href="https://sc.chinaz.com/moban/">&#x7F51;&#x9875;&#x6A21;&#x677F;</a></p>
						</div>
					</div>
				</div>
			</div>
		</div>

	</footer>
	<!-- Footer End -->
	
	<div class="scroll-area">
	   <i class="fa-regular fa-arrow-up"></i>
	</div>

    <!-- Js File -->
    <script src="static/js/modernizr.min.js"></script>
    <script src="static/js/jquery-3.6.3.min.js"></script>
    <script src="static/js/popper.min.js"></script>
    <script src="static/js/bootstrap.min.js"></script>
    <script src="static/js/mixitup.min.js"></script>
    <script src="static/js/glightbox.min.js"></script>
    <script src="static/js/jquery.waypoints.min.js"></script>
    <script src="static/js/jquery.counterup.min.js"></script>
    <script src="static/js/vanilla-tilt.min.js"></script>
    <script src="static/js/swiper-bundle.js"></script>
    <script src="static/js/scrollCue.min.js"></script>
    <script src="static/js/particles.js"></script>
    <script src="static/js/wow.js"></script>
    <script src="static/js/mobile-menu.js"></script>
    <script src="static/js/main.js"></script>
</body>
</html>